<template >
  <div>
    <slot v-for='(item) in list'  :slotProps='item'></slot>
  </div>
</template>
<script>
export default {
  name: "data-v-tableItem",
  props: {
    label: {
      type: String,
      default: "",
    },
    prop: {
      type: String,
      default: "",
    },
    textWidth: {
      type: String | Number,
      default: 60,
    },
    align: {
      type: String,
      default: "left",
    },
  },
  data() {
    return {
      list: this.$parent.list
    }
  },
  mounted() {
    const columns = this.$parent.headerList;
    const { label, prop, textWidth, align } = this;
    const children = this.$parent.$refs.hiddenColumns.children;
    console.log("this.$el",this.$el);
    const columnIndex = [].indexOf.call(children,this.$el);
    columns.push({ label, prop, textWidth, align,columnIndex,children:this.$el });
    this.$parent.columns = columns;
  },
  render() {},
};
</script>
<style >
  .hidden{
    display: none;
  }
</style>